import React from 'react'
import { Layout } from 'antd';
import Menu from '../Menus/Menus';
// import { Outlet } from "react-router-dom";
import Headers from '../Headers'
const { Header, Sider, Content } = Layout;
// 组件的类型定义
interface ChildrenType {
    children: JSX.Element
}
const Index: React.FC<ChildrenType> = ({ children }) => {
    return (
        <Layout style={{ height: '100vh' }}>
            <Header style={{ height: '8%', backgroundColor: '#fff', position: 'fixed', left: '0', top: '0', zIndex: '1000', width: '100%' }}><Headers></Headers></Header>
            <Layout>
                <Sider width="12%" style={{ height: '100%', backgroundColor: '#fff', position: 'fixed', left: '0', top: '8%' }}>
                    <Menu></Menu>
                </Sider>
                <Content style={{ marginLeft: '11.7%', marginTop: '3.6%' }}>{children}</Content>
            </Layout>
        </Layout>
    )
}

export default Index